<template>
  <el-menu
    :default-active="this.$route.path"
    class="el-menu-vertical-demo"
    id="leftMenu"
    @select="handleSelect"
  >
    <el-menu-item v-for="(item,i) in navLeftList" :key="i" :index="item.name">
      <i :class="item.icon"></i>
      <span>{{ item.navItem }}</span>
      </el-menu-item>
  </el-menu>
</template>
<script>
export default {
  name: "leftMenu",
  data() {
    return {
      activeIndex: "1",
      navLeftList: [
        { name: "/pages/banner", 
        navItem: "轮播图管理" ,
        icon:"el-icon-picture"
        },
        { name: "/pages/classifyIndex", 
        navItem: "首页分类管理" ,
        icon:"el-icon-menu"
        },
        { name: "/pages/hots", 
        navItem: "热销商品" ,
        icon:"el-icon-s-flag"
        }
      ]
    };
  },
  methods: {
    handleSelect(key, keyPath) {
      console.log(key, keyPath);
    }
   
  },
  mounted: function() {
    let windowH = document.documentElement.clientHeight;
    document.getElementById("leftMenu").style.height = windowH - 60 + "px";
  }
};
</script>
<style scoped>
.el-menu-item,
.el-submenu__title {
  height: 48px;
  line-height: 48px;
}
</style>